<template>
  <div class="side_box">
    <SelfAside :menuData="menuData" @asideClick="asideClickFn" :currentIndex="currentIndex"></SelfAside>
  </div>
</template>

<script>
import { defineComponent, reactive } from "vue";
import SelfAside from "./selfAside.vue";
import { asideData } from "../../service/aside/test";
// import { addDynamicRoutes } from "../../router/router";
export default defineComponent({
  name: "selfAsideBox",
  components: {
    SelfAside,
  },
  props: {
    currentIndex: {
      type:String
    }
  },
  setup(props,{emit}) {
    const asideClickFn = (payload) => {
      emit("asideClick",payload)
    };
    const menuData = reactive(asideData);
    // addDynamicRoutes();

    return {
      menuData,
      asideClickFn,
    };
  },
});
</script>
<style scoped>
.side_box {
  height: calc(100vh - 60px);
  overflow-y: scroll;
  box-sizing: border-box;
  background-color: rgba(84, 92, 100, 1);
  width: 210px;
  -ms-overflow-style: none; /* Internet Explorer 10+ */
  scrollbar-width: none; /* Firefox */
}
.side_box::-webkit-scrollbar {
  width: 0; /*Chrome, Safari 和 Opera*/
}
.el-header {
  --el-header-padding: 0 !important;
}
</style>